<template>
  <div>
    <!-- 自定义指令使用: v-指令 -->
    <h1 v-bgColor>局部自定义指令</h1>

    <hr />

    <h1 v-bold>全局自定义指令</h1>
  </div>
</template>

<script>
/* 
  有的情况下，你仍然需要对普通 DOM 元素进行底层操作，这时候就会用到自定义指令
*/
export default {
  name: "App",
  //局部指令
  directives:{
    //参数:使用当前指令的元素
    bgColor(ele){
      ele.style.background = "deepskyblue"
    }
  }
};
</script>

<style>
.o{
  background-color: aqua;
}
</style>